<html>
<head>

<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<title>淘图志</title>

<link rel="stylesheet" type="text/css" href="taotuzhi.css" />
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.12.custom.css" rel="stylesheet" />	
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12.custom.min.js"></script>
<script>
    function search(keyword, pageNo)
    {
    	var url = "/items.php";
    	var data = {
    		key: keyword,
    		page_no: pageNo,
    		page_size: 12,
    	};
		$.ajax({
			type: "GET",
			url: url,
			data: data,
			success: function(html){
			$("#items").html(html);
			}
		});
    }

	$(function(){
   		$("#search-form").submit(function(event){
   			event.preventDefault();
		    var keyword = $("#keyword").val();
		    search(keyword, 1);
    	});
    	
    	$("#nextPage").click(function(event)
    	{
    		var keyword = $("#keyword").val();
		    search(keyword, 2);
    	});
    	
    	var keyword = $("#keyword").val();
		search(keyword, 1);
 	});
	
</script>
</head>

<body>

<table>
<tr>
<td id="nav">
	<div>
	<form id="search-form">
		<input type="text" id="keyword" value="女装"/>
		<input id="search-button" type="submit" class="button" value="找宝贝" />
	</form>
	</div>
</td>
<td id="result">
	<div id="items"></div>
	<div><button id="prePage">&lt;&lt;</button><button id="nextPage">&gt;&gt;</button></div>
</td>
</tr>
</table>

</body>
</html>